<template>
	<view class="zui_avatar">
		<view class="img" :style="'background:'+color+';width:'+size+';height:'+size+';'">
			<image v-if="src" :src="src" :style="'border:'+border+' '+color+' solid;}'" ></image>
			<image v-else src="~@/static/img/logo.png" :style="'border:'+border+' '+color+' solid;}'" ></image>
		</view>
	</view>
</template>

<script>
	export default {
		name: "VantAvatar",
		props: {
			src: String,
			color: String,
			size: String,
			border: {
				type: [String, Boolean],
				default: "6rpx",
			},
		},
		data() {
			return {};
		},
		created() {},
		methods: {},
	};
</script>

<style lang="scss" scoped>
	.zui_avatar{
		.img {
			position: relative;
			width: 226rpx;
			height: 226rpx;
			overflow: hidden;
			border-radius: 50%;
			image {
				width: 100%;
				height: 100%;
				border-radius: 50%;
				display: block;
				box-sizing: border-box;
			}
		}
	}
	
</style>
